<template>
  <div>
    <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" >
      <el-menu-item index="0">首页</el-menu-item>
      <el-menu-item index="1" @click="toFoodPage">外卖预订</el-menu-item>
      <el-menu-item index="2" @click="toSelectPage">商品购买</el-menu-item>
      <el-menu-item index="3" @click="toMedicalPage">医疗服务</el-menu-item>
      <el-menu-item index="4" @click="toBasePage">绿化基地</el-menu-item>
    </el-menu>
  </div>
</template>

<script>
export default {
  name:'naviBar',
  data() {
    return {
      activeIndex: '0',
      path:''
    };
  },
  methods: {
    toSelectPage(){
        this.$router.push('/Shopping')
    },
    toFoodPage(){
        this.$router.push('/Food')
    },
    toMedicalPage(){
        this.$router.push('/Medical')
    },
    toBasePage(){
      this.$router.push('/Base')
    }
  }
}
</script>

<style scoped>

</style>
